<template>
	<view class="task">
		<!-- <u-notice-bar @click="noticeInfo" more-icon type="primary " :list="noticelist"></u-notice-bar> -->
		<view v-for="(item, index) in list" :key="index" @click="goDetail(item)">
			<view class="modular flex">
				<image :src="require('@/common/images/task-icon1.png')" mode=""></image>
				<view class="item flex-column">
					<view class="sn">机具号：{{ item.serialno }}</view>
					<view class="money flex-space-between">
						<text>
							服务费金额：
							<text class="red">{{ toFixedNum(item.depositAmount) }}</text>
						</text>
						<text class="iconfont icon-Downarrow-R iconfont-right"></text>
					</view>
					<view class="time">计划开始时间：{{ formDate(item.transDate) }}</view>
					<view class="rule">
						规则说明：商户自注册次日起，每20天为一个周期，每个周期内交易大于5000元，连续交易达标8个周期，系统自动返还服务费。只有智慧（普通）的贷记卡交易才算交易达标
					</view>
				</view>
				<view class="state" :class="{ finish: item.exeStatus == 2 }">{{ item.exeStatus | exeStatus }}</view>
			</view>
		</view>
		<noData v-if="!list.length"></noData>
		<!-- <uni-load-more :status="loadMore"></uni-load-more> -->
	</view>
</template>

<script>
import { depositCheckList } from '_a/termTask';
import loadMoreData from '@/mixins/loadmore';
import { formDate } from '_c/utils/date';
export default {
	mixins: [loadMoreData],
	data() {
		return {
			list: []
			// noticelist:[''],
		};
	},
	// 下拉刷新
	async onPullDownRefresh() {
		await this.init();
		uni.stopPullDownRefresh();
	},
	onLoad() {
		this.init();
	},
	methods: {
		noticeInfo() {
			this.$tip.modal({
				content: `${this.noticelist[0]}`,
				showCancel: false
			});
		},
		reachBottomCallBack() {
			this.getList();
		},
		goDetail(item) {
			this.$nav.push({
				path: '/pages/home/termTaskList/termTaskDetail',
				query: {
					id: item.id,
					orderNo: item.orderNo
				}
			});
		},
		getList() {
			//   let params = {
			//     pageNum: this.pageNum,
			//     pageSize: this.pageSize,
			//     ...this.query,
			//   };
			depositCheckList().then(res => {
				var list = res.data;
				this.loadMoreStatusDeal(res.data);
				if (list.length > 0) {
					this.list = this.list.concat(list);
				}
			});
		}, // 初始化数据
		init() {
			this.$nextTick(() => {
				this.list = [];
				this.getList();
			});
		}
	}
};
</script>

<style lang="scss">
.task {
	padding: R(25) 0;
}
page {
	background: #fafbfc;
}
.modular {
	background: #ffffff;
	box-shadow: 0px R(11) R(13) 0px rgba(80, 114, 147, 0.05);
	border-radius: R(20);
	padding: R(45) 0 R(23) R(23);
	margin: 0 R(25) R(20);
	position: relative;
	> image {
		width: R(90);
		height: R(90);
		margin-right: R(18);
	}
	.item {
		flex: 1;
		.sn {
			font-size: R(29);
			font-weight: 600;
			color: #000000;
		}
		.money {
			font-size: R(28);
			font-weight: 400;
			color: #b3b3b3;
			padding: R(11) 0 R(21);
			border-bottom: R(1) solid #eee;
		}
		.time {
			font-size: R(26);
			font-weight: 400;
			color: #999999;
			margin-top: R(21);
		}
		.rule {
			font-size: R(23);
			color: #999999;
			margin-top: R(10);
			padding-right: R(10);
		}
		.red {
			color: #ff0000;
		}
	}
	.state {
		position: absolute;
		right: 0;
		top: 0;
		width: R(137);
		height: R(50);
		line-height: R(50);
		background: #2e8ded;
		border-radius: 0px R(20) 0px R(20);
		text-align: center;
		font-size: R(23);
		font-weight: 400;
		color: #ffffff;
	}
	.finish {
		background: #d9d9d9;
		color: #ffffff;
	}
}
</style>
